<template>
  setup风格的测试——局部状态：<br>
  <el-button type="" @click="testState">翻页</el-button>
  <el-button type="" @click="testTract2">重置分页</el-button>
  
  <hr>
  pagerIndex：{{ state.pagerInfo.pagerIndex }}
  <hr>
    
</template>
  
<script setup lang="ts">
  import { reactive, readonly } from 'vue'
  
  import {
    regListState
  } from './_state-data-list'

  // 注册一个状态，返回状态和记录集合
  const state = regListState((query: any, pagerInfo: any) => {
    // 获取数据和总记录数

    const re = {
      allCount: 1000,
      list: [
        {
          name: '局部状态：' + pagerInfo.pagerIndex
        }
      ]
    }
    return re
  })

  console.log('state\n', state)

  // 翻页
  const testState = () => {
    state.pagerInfo.pagerIndex += 1
  }

  // 重置
  const testTract2 = () => {
    state.loadData(true)
  }
  
  </script>